<!-- * 文件名：通知公告
* 作者：ZQK
* 描述：〈描述〉
* 修改人：ZQK
* 修改时间：2025-3-9  -->
<template>
	<view class="noticeDetail">
		<view class="contentBox">
			<view class="title">
				<view class="titleText">
					<view class="vertical"></view>
					<view class="text">{{temp.noticeTitle}}</view>
				</view>
			</view>
			<view class="itemSubTitle">{{temp.createTime}}</view>
			<view class="content">{{temp.noticeContent}}</view>
		</view>
	</view>
</template>

<script setup lang="ts">
	import { reactive, ref } from 'vue'
	import { onShow, onLoad } from "@dcloudio/uni-app"
	import { getUrl } from '@/utils/imagePlugin'
	import Api from '@/api/modules/home.ts'
	
	const temp = ref<any>({
		noticeTitle: '',
		createTime: '',
		noticeContent: '',
	})
	
	const detailId = ref<string>('')
	const getDetail = () => {
		Api.getNoticeDetail(detailId.value).then((res: any) => {
			temp.value = res.data
		})
	}
	
	onLoad((options: any)=>{
		detailId.value = options.id
		getDetail()
	})
</script>

<style lang="scss" scoped>
	.noticeDetail{
		background: #5EB847;
		height: 100vh;
		display: flex;
		flex-direction: column;
		
		.contentBox{
			background: #ffffff;
			border-radius: 32rpx 32rpx 0rpx 0rpx;
			margin-top: 16rpx;
			padding-top: 38rpx;
			padding-bottom: 60rpx;
			flex: 1;
			overflow: auto;
			display: flex;
			flex-direction: column;
		
			.title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin-bottom: 18rpx;
				
				.titleText{
					display: flex;
					align-items: center;
					
					.vertical{
						width: 6rpx;
						height: 26rpx;
						background: #5EB847;
						border-radius: 0rpx 4rpx 4rpx 0rpx;
						margin-right: 34rpx;
					}
					
					.text{
						font-size: 28rpx;
						color: #000;
						font-weight: 600;
						max-width: 520rpx;
						word-break: break-all;
					}
				}
			}
			
			.itemSubTitle {
				font-size: 26rpx;
				color: #483D33;
				margin-left: 40rpx;
				margin-bottom: 20rpx;
			}
		
			.content{
				background: #f1f5ee;
				border-radius: 16rpx;
				margin: 0 28rpx;
				padding: 28rpx;
			}
		}
	}
</style>